<template>
  <view class="container">
    <TopBtn :title="'预览处方'"></TopBtn>
    <view class="card">
      <view class="title flex-sp-center">
        淄博市中心医院
        <view class="time">
          <uni-dateformat :date="data.createTime" format="yyyy-MM-dd hh:mm"></uni-dateformat>
        </view>
      </view>
      <image class="ytg" v-if="data.auditStatus == 1" src="@/static/ConsultationRoom/ytg.png" mode=""></image>
      <view class="info">
        <view class="w50">
          姓名：{{ data.patientName }}
        </view>
        <view class="w50">
          性别：{{ data.patientSex == 1 ? '男' : '女' }}
        </view>
        <view class="w50" v-if="data.height">
          身高：{{ data.height }}cm
        </view>
        <view class="w50" v-if="data.weight">
          体重：{{ data.weight }}kg
        </view>
        <view class="w50">
          科室：{{ data.departName }}
        </view>
        <view class="w50">
          年龄：{{ data.patientAge }}岁
        </view>
      </view>
    </view>
    <view class="card">
      <view class="title">
        诊断结果
      </view>
      <view class="info">
        {{ data.diagnosis }}
      </view>
    </view>
    <view class="card">
      <view class="title">
        rp 中药饮片
      </view>
      <view class="info">
        <view class="w50" v-for="n in showdrugName">
          {{ n.name }}{{ n.dosage }} <text v-if="n.DecoctionMethod">({{ n.DecoctionMethod }})</text>
        </view>
        <view class="row">
          <text>用法：</text>
          共{{ showapply.dose }}剂，{{ showapply.operationMethod }}，{{ showapply.dosageNum }}，{{ showapply.usageCount }}，{{
      showapply.perUse }}
        </view>
        <view class="row" v-if="data.machining">
          <text>加工：</text>
          {{ data.machining }}
        </view>
        <view class="row" v-if="data.medicalAdvice">
          <text>医嘱：</text>
          {{ data.medicalAdvice }}
        </view>
      </view>
    </view>
    <view class="card">
      <view class="title">
        备注
      </view>
      <view class="info">
        1、处方有效期为3天; <br />
        2、支持凭本处方到线下药店购药或将本处方上传至其他网上购药平台(如京东、阿里等)找医生抄方后购药;<br />
        3、如需医保报销，您需凭本处方到附近线下实体医院抄方购药<br />
      </view>
    </view>
    <view class="kong">

    </view>
    <view class="btnBox flex-sp-center" v-if="butShow">
      <view class="updata flex-center-center" @click="Back()">
        修改
      </view>
      <view class="add flex-center-center" @click="sub()">
        {{ data.id ? '修改签名' : '提交签名' }}
      </view>
    </view>
  </view>
</template>

<script>
import {
  SendGroupMessage
} from '@/utils/TIM'
import {
  getPrescriptionInfo,
  createPrescriptionInfo,
  updatePrescriptionInfo
} from '@/api/ConsultationRoom'
export default {
  data () {
    return {
      data: {},
      id: "",
      showdrugName: {},
      showapply: {},
      type: 1,
      butShow: true
    };
  },
  onLoad (e) {
    let that = this
    if (e.id) {
      this.id = e.id
      this.getPrescriptionInfo()
    }
    if (e.updata == 0) {
      this.butShow = false
    }
    if (e.type == 2) {
      uni.getStorage({
        key: 'paramsData',
        success: function (res) {
          if (res.data) {
            that.data = JSON.parse(res.data);
            that.showdrugName = JSON.parse(that.data.drugName)
            that.showapply = JSON.parse(that.data.apply)
            console.log(that.data)
          }
        }
      });
    }
  },
  methods: {
    Back () {
      //uni.navigateBack()//默认delta:1
      uni.$emit('show', true)
      uni.navigateBack({
        delta: 1, //返回层数，2则上上页
      })
    },
    sub () {
      uni.showLoading({
        title: '加载中',
        mask: true
      })

      if (this.data.id) {
        updatePrescriptionInfo(this.data).then(res => {
          this.patientdata = res.data

          // 发送群消息
          this.sendMessage(this.data.diagnosis)

          uni.showToast({
            title: '操作成功',
            duration: 200,
            icon: 'none',
          })
          setTimeout(() => {
            uni.hideLoading()
            uni.$emit('show', true)
            uni.navigateBack({
              delta: 2, //返回层数，2则上上页
            })
          }, 200); // 3000毫秒后执行
        })
      } else {
        createPrescriptionInfo(this.data).then(res => {
          this.patientdata = res.data

          // 发送群消息
          this.sendMessage(this.data.diagnosis)


          uni.showToast({
            title: '操作成功',
            duration: 200,
            icon: 'none',
          })
          setTimeout(() => {
            uni.hideLoading()
            uni.$emit('show', true)
            uni.navigateBack({
              delta: 2, //返回层数，2则上上页
            })
          }, 200); // 3000毫秒后执行
        })
      }
    },
    getPrescriptionInfo () {
      getPrescriptionInfo({
        id: this.id
      }).then(res => {
        this.data = res.data
        this.showdrugName = JSON.parse(res.data.drugName)
        this.showapply = JSON.parse(res.data.apply)
        console.log(this.showdrugName)
        console.log(this.showapply)
      })
    },
    sendMessage (text) {
      // 发送群消息
      const message = {
        businessID: 'tip',
        type: 'card',
        title: '处方笺',
        text,
        buttonText: '去查看',
        buttonUrl: {
          patient: `/pagesCommon/prescription/prescriptionDetails?id=${this.data.outPatientId}`,
          doctor: `/pages/ConsultationRoom/PrescriptionDetails/PrescriptionDetails?id=${this.data.outPatientId}`,
        },
      }
      SendGroupMessage(this.data.groupId, message)
    },
  }
}
</script>

<style lang="less" scoped>
.btnBox {
  position: fixed;
  width: 750rpx;
  bottom: 0;
  height: 162rpx;
  background: #FFFFFF;
  padding: 0 50rpx;
  box-sizing: border-box;

  .updata {
    width: 218rpx;
    height: 100rpx;
    background: #FFFFFF;
    border-radius: 50rpx;
    font-weight: 500;
    font-size: 28rpx;
    color: #3B6CFE;
    border: 1px solid #3B6CFE;
  }

  .add {
    width: 364rpx;
    height: 100rpx;
    background: #3B6CFE;
    border-radius: 50rpx;
    font-weight: 500;
    font-size: 28rpx;
    color: #FFFFFF;
  }
}

.card {
  margin-top: 30rpx;
  width: 750rpx;
  min-height: 122rpx;
  background: #FFFFFF;
  padding: 0 30rpx 30rpx;
  box-sizing: border-box;
  position: relative;

  .ytg {
    position: absolute;
    top: 24rpx;
    right: 35rpx;
    width: 172rpx;
    height: 171rpx;
  }

  .title {
    height: 95rpx;
    line-height: 95rpx;
    font-weight: bold;
    font-size: 34rpx;
    color: #333333;
    border-bottom: 1px solid #EEEEEE;

    .time {
      font-weight: 500;
      font-size: 24rpx;
      color: #999999;
    }
  }

  .info {
    padding-top: 30rpx;
    font-weight: 500;
    font-size: 28rpx;
    color: #333333;
    display: flex;
    flex-wrap: wrap;

    .w50 {
      width: 50%;
      margin-bottom: 20rpx;
    }

    .row {
      margin-top: 20rpx;
      width: 100%;
      display: flex;

      text {
        width: 120rpx;
      }
    }
  }
}
</style>